* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	font-family: 'PingFang SC', 'Helvetica Neue', Arial, sans-serif;
}

body {
	background-color: #f5f5f5;
	color: #333;
	max-width: 600px;
	margin: 0 auto;
}

.header {
	position: sticky;
	top: 0;
	background: #fff;
	padding: 10px 15px;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
	z-index: 100;
}

.search-bar {
	display: flex;
	align-items: center;
}

.search-input {
	flex: 1;
	background: #f5f5f5;
	border: none;
	border-radius: 20px;
	padding: 8px 15px;
	font-size: 14px;
}

.location {
	display: flex;
	align-items: center;
	margin-top: 8px;
	font-size: 12px;
}

.location-icon {
	margin-right: 5px;
	color: #ff5339;
}

.banner {
	height: 120px;
	background: linear-gradient(135deg, #ff9a44, #ff5339);
	margin: 10px 15px;
	border-radius: 8px;
	color: white;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 18px;
	font-weight: bold;
}

.quick-actions {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	background: white;
	padding: 15px 0;
	margin-bottom: 10px;
}

.action-item {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.action-icon {
	width: 40px;
	height: 40px;
	background: #ffefeb;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 5px;
	color: #ff5339;
}

.action-text {
	font-size: 12px;
}

.section-title {
	padding: 10px 15px;
	font-size: 16px;
	font-weight: bold;
	display: flex;
	justify-content: space-between;
}

.restaurant-card {
	background: white;
	margin: 0 15px 10px;
	border-radius: 8px;
	overflow: hidden;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.restaurant-image {
	height: 120px;
	background: #eee;
	position: relative;
}

.restaurant-tag {
	position: absolute;
	bottom: 10px;
	left: 10px;
	background: rgba(0, 0, 0, 0.6);
	color: white;
	padding: 2px 8px;
	border-radius: 4px;
	font-size: 12px;
}

.restaurant-info {
	padding: 10px;
}

.restaurant-name {
	font-weight: bold;
	margin-bottom: 5px;
}

.restaurant-meta {
	display: flex;
	font-size: 12px;
	color: #999;
	margin-bottom: 5px;
}

.rating {
	color: #ffaa00;
	margin-right: 10px;
}

.delivery-info {
	display: flex;
	font-size: 12px;
	color: #666;
}

.delivery-time {
	margin-right: 15px;
}

.bottom-nav {
	position: fixed;
	bottom: 0;
	width: 100%;
	max-width: 600px;
	display: flex;
	background: white;
	box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.05);
}

.nav-item {
	flex: 1;
	text-align: center;
	padding: 8px 0;
	color: #999;
}

.nav-item.active {
	color: #ff5339;
}

.nav-icon {
	font-size: 20px;
	margin-bottom: 2px;
}
